<template>
  <div>用户名:<br><input type="text" name="person.person.userName"></div>
  <div>密码:<br><input type="password" name="person.person.userPwd"></div>
  <div><button type="button" value="登录" @click="login"></button></div>
</template>

<script setup lang="ts">

import {reactive,toRefs} from 'vue';


let data = reactive({
  person:{
    userName:'',
    userPwd:''
  }
})

let person =toRefs(data);

let login = ()=>{

  if(person.person.value.userName==''){
    return alert('用户名不能为空')
  }
 if(person.person.value.userPwd==''){
    return alert('密码不能为空')
  }

  if(person.person.value.userName=='Admin123' && person.person.value.userPwd=='Admin123'){
    alert('登录成功')
  }
}

</script>

<style scoped>

</style>